<!DOCTYPE html>
<html ng-app>
<head>
    <meta charset="utf-8" />
    <title>用户注册</title>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
</head>
<body>
    <form name='addUserForm' ng-controller="AddUserController">
        <h1>Sign up</h1>
        <hr/>
        <p>
            <label>First name:</label>
            <input ng-model='user.first' required />
        </p>
        <p>
            <label>Last name:</label>
            <input ng-model='user.last' required />
        </p>
        <p>
            <label>Email:</label>
            <input type="email" ng-model='user.email' required />
        </p>
        <p>
            <label>Age:</label>
            <input type="number" ng-model='user.age' ng-maxlength='3' ng-minlength='1' />
        </p>
        <p>
            <button ng-click="addUser()" ng-disabled="!addUserForm.$valid">Submit</button>
        </p>
    </form>
    <script type="text/javascript">
        function AddUserController($scope){
            $scope.message = "";
            $scope.addUser = function(){
                $scope.message = "Thanks, " + $scope.user.first + ", we add you!";
            }
        }
    </script>
</body>
</html>